<template>
	<div id="addaddress">
		<!---->
		<input class="l" v-model="username" placeholder="收货人真实姓名"/>
		<input class="l"type="text" placeholder="电话" v-model="phone" style="border-bottom:0px"/>
		<group label-width="10em" label-align="left">
			<x-address title="" v-model="value2" raw-value :list="addressData" value-text-align="left" :placeholder="value5"></x-address>
		</group>
		<input class="l"type="text" placeholder="详细地址" style="border-bottom: none;margin-bottom:40px;" v-model="address"/>
		
		<div class="conserve" @click="baocun">保存收货地址</div>
		<loading :show="show2" :text="text1"></loading>
		<toast type="text" v-model="show3">{{tishi}}</toast>
		
	</div>
</template>

<script>
	import { mapState, mapActions} from 'vuex'
	import { Toast,XAddress,Group,ChinaAddressV4Data, Value2nameFilter as value2name } from 'vux'
	import axios from 'axios'
	export default {
		components: {
			mapState,
	    	mapActions,
	    	Toast,
	    	XAddress,
	    	Group,
		},
		data(){
			return{
				username:'',
				areaid_1:'',
				areaid_2:'',
				areaid_3:'',
				address:'',
				phone:'',
				address_id:'',
				show2:false,
	  			text1:'loading...',
	  			show3:false,
	  			tishi:'',
	  			value2: [],
	  			addressData: ChinaAddressV4Data,
	  			value5:'请选择地址',
	  			data:'',
			}
		},
		created(){
//			this.show2 = true;
//			this.username = this.$route.query.username;
//			this.areaid_1 = this.$route.query.areaid_1;
//			this.areaid_2 = this.$route.query.areaid_2;
//			this.areaid_3 = this.$route.query.areaid_3;
//			this.address = this.$route.query.address;
//			this.phone = this.$route.query.phone;
//			this.address_id = this.$route.query.address_id;
//			this.show2 = false;
//			this.value5 = this.areaid_1+this.areaid_2+this.areaid_3;
//			console.log(this.value5);
			var address_id = this.$route.query.address_id;
			axios.post(this.url + '/home/Address/updateAddress',{openid:this.token,address_id:address_id}).then((res)=>{
				console.log(res);
				this.data = res.data;
				this.username = this.data.username;
				this.phone = this.data.phone;
				this.value5 = this.data.areaid_1 + this.data.areaid_2 + this.data.areaid_3;
				this.address = this.data.address;
			})
		},
		methods:{
			baocun(){
				console.log(this.value5);
				var address_id = this.$route.query.address_id;
				if(this.value2 == []){
					this.value2.push(this.value5.split(","));
					console.log(this.value2);
					var str = this.value2.toString();
					var sheng = str.substring(0,3);
					var shi = str.substring(3,6);
					var qu = str.substring(6,9);
					console.log(sheng);
					console.log(shi);
					console.log(qu);
					axios.post(this.url + '/home/Address/updateAddress_do',{username:this.username,areaid_1:sheng,areaid_2:shi,areaid_3:qu,address:this.address,phone:this.phone,address_id:this.address_id,openid:this.token,address_id:address_id}).then((res)=>{
						console.log(res);
						this.show3 = true;
						this.tishi = res.data.msg;
						if(res.data.status == 1){
							setTimeout(()=>{
								this.$router.push('/shdz1');
							},2000)
						}
					})
					
				}else{
					console.log(this.value2);
					this.getName(this.value2);
					var endValue = this.getName(this.value2);
					var str = endValue.toString();
					var sheng = str.substring(0,3);
					var shi = str.substring(4,7);
					var qu = str.substring(8,11);
					console.log(endValue);
					var address_id = this.$route.query.address_id;
					axios.post(this.url + '/home/Address/updateAddress_do',{username:this.username,areaid_1:sheng,areaid_2:shi,areaid_3:qu,address:this.address,phone:this.phone,address_id:this.address_id,openid:this.token,address_id:address_id}).then((res)=>{
						console.log(res);
						this.show3 = true;
						this.tishi = res.data.msg;
						if(res.data.status == 1){
							setTimeout(()=>{
								this.$router.push('/shdz1');
							},2000)
						}
					})
//				console.log(this.getName(this.value2));
				}

			},
			getName(value){
				return value2name(value, ChinaAddressV4Data);
			}
		},
		computed:{
	      ...mapState({
	          token: state => state.Token.userToken()//获取用户Token
	      }),
	    }
	}
</script>

<style>
	body{
		font-size: 16px;
	}
	#addaddress .l{
		width:100%;
		height:40px;
		border:none;
		outline: none;
		text-indent:15px;
		border-bottom: 1px solid #e6e0e0;
		color:#757575;
	}
	#addaddress .weui-cells{
		margin-top:0px;
		border-top:0px;
		padding-top:0px !important;
		padding-bottom:0px !important;
		/*height:40px;*/
		/*font-size: 13px;*/
	}
	#addaddress .vux-popup-picker-select span{
		font-size:13px;
		color:#757575;
	}
	#addaddress .vux-cell-placeholder{
		display: inline-block;
		width:100%;
		height:20px;
	}
	#addaddress .weui-cell__hd{
		/*width:100%;*/
		color:#757575;
		font-size: 13px;
		height:20px;
	}
	/*#addaddress label{
		border-bottom: 0px !important;
		height:20px !important;
	}*/
	#addaddress .s{
		width:88%;
		height:40px;
		border:none;
		outline: none;
		padding-left:15px;
	}
	#addaddress label{
	/*	box-sizing: border-box;*/
		display: inline-block;
		width:100%;
		height:40px;
		background: #fff;
		border-bottom: 1px solid #ccc;
	}
	#addaddress .conserve{
		width:88%;
		height:44px;
		line-height:44px;
		background: #00C850;
		border-radius: 4px;
		font-size: 16px;
		color: #FFFFFF;
		letter-spacing: 0.32px;
		margin:0 auto;
		text-align: center;
	}
	
</style>